<template>
	<view class="uni_box">
		<!-- <navbar :isback='false' backgroundColor='#fff'>
			<view slot="left" class="hleft">
				<image class="gllogo" src="/static/LOGO.png" />
			</view>
		</navbar> -->
		<navbar :isback='false' title='研友帮-查考点'>
		</navbar>
		<!-- :style="{top:offTop+'rpx'}" -->
		<!-- #ifdef APP-PLUS -->
		<view class="immerse"></view>
		<!-- #endif -->
		<view class="newcontent">
			<view class="wrap">
				<u-swiper :list="banner" border-radius="25" height="285"></u-swiper>
				<view class="leiview">
					<view class="quanviewitems" @click="chakao"><image class="quanview" src="/static/new/kao.png" style="pointer-events: auto !important;"/></view>
					<view class="quanviewitems"  @click="gouClick">
						<image class="quanview" src="/static/new/quan.png" style="pointer-events: auto !important;" />
					</view>
					
				</view>
			</view>
			<view class="yantit" v-if="guanlist">
				<image class="hquan" src="/static/new/hquan.png" />
				<text class="ytit">关于研友帮-提前查考点</text>
			</view>
			<view class="neione">
				<text class="neitit">{{guanlist}}</text>
				<view class="biaozhi">
					<view class="biaoitem">
						<image class="yimg" src="/static/new/yone.png" />
						<text>预测准确</text>
					</view>
					<view class="biaoitem">
						<image class="yimg" src="/static/new/ytwo.png" />
						<text>服务专业</text>
					</view>
					<view class="biaoitem">
						<image class="yimg" src="/static/new/ythree.png" />
						<text>价格透明</text>
					</view>
					<view class="biaoitem">
						<image class="yimg" src="/static/new/yfour.png" />
						<text>行业第一</text>
					</view>
				</view>
			</view>

			<view class="yantit" v-if="pinlist">
				<image class="hquan" src="/static/new/lv.png" />
				<text class="ytit">研友帮-用过的都说棒</text>
			</view>
			<view class="neitwo" v-if="pinlist">
				<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
					:duration="duration" :current="swcurrent" @change="swchange" next-margin="10px">
					<swiper-item class="swiperitem" v-for="(item, index) in pinlist" :key="index">
						<view class="sview">
							<view class="lunone">
								<image class="jtou" :src="item.avatar" />
								<view class="jiright">
									<text class="jiname txt">{{item.nickname}}</text>
									<view class="xingji">
										<u-rate :count="count" v-model="value" active-color="#ff6d00" size="25"></u-rate>
									</view>
								</view>
							</view>
							<view class="lunwen">
								{{item.content}}
							</view>
						</view>
					</swiper-item>
				</swiper>
			</view>

			<view class="yantit" v-if="youlist">
				<image class="hquan" src="/static/new/lan.png" />
				<text class="ytit">研友帮-提前查考点的优势</text>
			</view>

			<view class="neithree">
				<view class="buview" v-for="(item,index) in youlist" :key="index">
					<view class="numview">
						<image class="oneicon" src="/static/new/one.png" v-if="index==0" />
						<image class="oneicon" src="/static/new/two.png" v-if="index==1" />
						<image class="oneicon" src="/static/new/three.png" v-if="index==2" />
						<image class="oneicon" src="/static/new/four.png" v-if="index==3" />
						<text class="stit">{{item.content}}</text>
					</view>
					<view class="buimgview">
						<image class="buimg" :src="item.image" />
					</view>
				</view>
			</view>

			<view class="yantit" style="margin-top: 30rpx;" v-if="gonglist">
				<image class="hquan" src="/static/new/hquan.png" />
				<text class="ytit">省钱省事攻略</text>
			</view>
			<view class="neifour">
				<view class="neifview" v-for="(item,index) in gonglist" :key="index">
					<image class="fimg" src="/static/new/banner.png" />
					<text class="butit">第{{index+1}}步</text>
					<view class="xian"></view>
					<text class="goumiao">{{ item.content }}</text>
				</view>
			</view>

			<view class="yantit" style="margin-top: 30rpx;" v-if="wenlist">
				<image class="hquan" src="/static/new/lv.png" />
				<text class="ytit">研友帮-问答</text>
			</view>
			<view class="neifive">
				<view class="wenview" v-for="(item,index) in wenlist" :key="index">
					<view class="wenone">
						<image class="wenicon" src="/static/new/wen.png" />
						<text class="wentit">{{item.title}}</text>
					</view>
					<view class="wenone">
						<image class="wenicon" src="/static/new/da.png" />
						<text class="datit">{{ item.content }}</text>
					</view>
				</view>
			</view>
			
			<!-- 支付弹窗 -->
			<zhipop :dishow="dishow" @shaiclose="dishow=false"></zhipop>
			<!-- 筛选弹窗 -->
			<ns-login :loginshow="loginshow" ref="login" @saveUserInfo="onUserInfoClick" :session_key="session_key"></ns-login>

		</view>
</view>
</template>

<script>
import nslogin from '@/components/ns-login/ns-login'
import zhipop from '@/components/zhipop/zhipop'
export default {
	data() {
		return {
			swlist: [{
				image: '/static/new/banner.png',
			},
			{
				image: '/static/new/banner.png',
			},
			{
				image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
			}
			],
			noticlist: [
				// '寒雨连江夜入吴寒雨连江夜入吴寒雨连江夜入吴寒雨连江夜入吴',
				// '平明送客楚山孤',
				// '洛阳亲友如相问',
				// '一片冰心在玉壶'
			],
			scrollLeft: 0,//滑动距离
			currentindex: 0,
			border: false,
			keyword: '',
			enable:false,
			Captop:0,
			offTop:0,
			Capheight:0,
			shaishow:false,
			loginshow:false,
			border:false,
			userinfo:{
				mobile: "",
				token: "bb22423a-be41-4419-a812-5778737759b9"
			},
			session_key:'',

			list: [],
			page: 1,
			limit: 5,
			last_page: 1,
			status: "loadmore",
			keywords:'',
			doesHaveBangs: false, // 为true表示有刘海屏
			moindex:'',
			
			classlist:[],
			childrenlist:[],
			banner:[],

			indicatorDots: false,
			autoplay: true,
			interval: 5000,
			duration: 1500,
			swcurrent: 0,
			count: 5,
			value: 5,
			dishow:false,//支付弹窗

			guanlist:'',//关于
			pinlist:[],
			youlist:[],//优势
			gonglist:[],//攻略
			wenlist:[],//问答列表

			zhilist:[],//支付列表
		}
	},
	components: {
		'ns-login': nslogin,
		'zhipop':zhipop
	},
	computed: {
	},

	mounted() {
		//在mounted中调用是确保元素已被加载
		//#ifdef MP-WEIXIN
		//通过getMenuButtonBoundingClientRect 获取胶囊的高度宽度等信息
		this.Cap = uni.getMenuButtonBoundingClientRect();
		console.log(this.Cap)
		this.Captop = this.Cap.top/ (uni.upx2px(100) / 100);
		
		
		console.log(this.Capheight)
		//我们需要吸顶的位置 是计算出来的  胶囊的高度height+胶囊距离顶部状态栏的距离top
		let CapHeight = (this.Cap.height + this.Cap.top);
		//由于拿到的单位是px 通过uni自带的upx2px方法 将px转换为rpx 
		//这样做是因为uView的Sticky组件要求传入的offset-top值单位是rpx
		this.offTop =Number( CapHeight / (uni.upx2px(100) / 100))-Number(this.Captop)
		//最后拿到想要的值并传入即可
		console.log(CapHeight)
		this.Capheight =  CapHeight-2;
		this.enable = true
		//#endif
		//#ifdef H5
		this.offTop = 44
		this.Capheight = 44
		//最后拿到想要的值并传入即可
		this.enable = true
		//#endif
	},
	async onLoad() {
		

	},
	async onShow() {
		// if(!uni.getStorageSync('token')){
		// 	// this.loginshow = true
		// 	// #ifdef MP
		// 	this.getLogin()
		// 	// #endif
		// 	// #ifdef H5
		// 	uni.setStorageSync('token',this.userinfo.token)
		// 	// uni.setStorageSync('userid',this.userinfo.user_id)
		// 	// #endif
			
			
		// 	this.getInit()
		// }else{
		// 	this.getInit()
		// }
		// #ifdef H5
		uni.setStorageSync('token','a640f31c-971b-4080-bf74-67d2062eb685')
		// #endif
		uni.setStorageSync('shop_id','1')
		this.getInit()
	},
	onReachBottom: function () {
	},
	onShareAppMessage(res) {
		if (res.from === 'button') { // 来自页面内分享按钮
			console.log(res.target);
		}
		return {
			title: '院校帮帮',
			// imageUrl:
			path: '/pages/tabbar/Tabhome'
		}
	},
	onShareTimeline(){
		return {
			title: '院校帮帮',
			path: '/pages/tabbar/Tabhome'
		}
	},
	methods: {
		async getLogin(){
			uni.login({
				provider: 'weixin',
				timeout: 3000,
				success: res => {
					console.log(res)
					// this.$u.toast(res.code);
					// this.copy(res.code)
					// this.loginshow = true
					if (res.code) {
						this.getLogintwo(res.code)
					}
				},
				fail: () => {
					uni.$u.toast("请求失败")
				}
			})
		},
		async getLogintwo(code){
			let res = await this.$u.api.miniapplogin({
				code:code,
				shop_id:uni.getStorageSync('shop_id')
				// userid:uni.getStorageSync('userid')
			});
			console.log(res)
			this.session_key = res.seeion_key
			uni.setStorageSync('token',res.userinfo.token)
			// uni.setStorageSync('userid',res.Data.userinfo.userid)
			if(res.userinfo.mobile == ''||!res.userinfo.mobile){
				//弹出登录
				this.loginshow = true
			}else{
				// this.getInit()
			}
			// // console.log(res)
			// console.log(res.Data)
		},
		getInit(){//请求接口
			// this.getGlass();//分类
			// this.getList()
			this.getLun();//轮播图
			this.getAbout();//关于
			this.getping();//获取好评
			this.getyoushi();//获取优势
			this.getgonglue();//获取攻略
			this.getwenda();//获取问答
			
		},
		gouClick(){
			console.log(uni.getStorageSync('token'))
			if(!uni.getStorageSync('token')){
				// this.loginshow = true
				// #ifdef MP
				this.getLogin()
				// #endif
				// // #ifdef H5
				// uni.setStorageSync('token',this.userinfo.token)
				// // uni.setStorageSync('userid',this.userinfo.user_id)
				// // #endif
			}else{
				this.dishow=true
			}
		},
		confirm(e){
			console.log(e)
			this.getGlass()
		},
		async getLun(){//获取轮博
			let res = await this.$u.api.getBanner({
				shop_id:uni.getStorageSync('shop_id')
			});
			this.banner = res
		},
		async getAbout(){//获取关于
			let res = await this.$u.api.getAbout({
				shop_id:uni.getStorageSync('shop_id')
			});
			this.guanlist = res.content
		},
		async getping(){//获取好评
			let res = await this.$u.api.getHaoping({
				shop_id:uni.getStorageSync('shop_id')
			});
			this.pinlist = res
		},
		async getyoushi(){//获取优势
			let res = await this.$u.api.getYoushi({
				shop_id:uni.getStorageSync('shop_id')
			});
			this.youlist = res
		},
		async getgonglue(){//获取攻略
			let res = await this.$u.api.getGonglue({
				shop_id:uni.getStorageSync('shop_id')
			});
			this.gonglist = res
		},
		async getwenda(){//获取问答
			let res = await this.$u.api.getQuestion({
				shop_id:uni.getStorageSync('shop_id')
			});
			this.wenlist = res
		},
		
		
		
		
		async getList(){//列表数据
			let res = await this.$u.api.getQuestion({
			  pagesize:this.limit,//首页传5 查看更多传10
			  page:this.page
			});
			console.log("++++")
			console.log(res)
			this.last_page = res.last_page;
			let shuju = res.data
			for(let i in shuju){
				shuju[i].iszhan = false
			}
			
			let list = shuju;
			this.list = this.page == 1 ? list : [...this.list, ...list];	
			// console.log(this.list)
			if(this.page >= this.last_page){
			  this.status = 'nomore';
			}
			
		},
		loadmore() {
			let page = this.page;
			// let last_page = this.last_page;
			if (this.status == 'loadmore') {
				this.page++;
				this.getList();
			}
		},
		async getuser() {
			let res = await this.$u.api.userinfo({
			});
			this.user = res.user

		},
		tolink() {
			this.navrouter("/pages_subject/sub/ceshi");
		},
		changeCate(index) {
			this.scrollLeft = 50 * (index - 1);
			this.currentindex = index
		},
		toDetail(){
			this.navrouter("/pages_subject/twoPage/Detail");
		},
		blur(){
			this.getClear()
		},
		getClear(){
			this.list = []
			this.page = 1,
			this.status= "loadmore"
			this.getList()
		},
		onUserInfoClick(e){
			console.log(e)
			if(e.code == 200){
				this.loginshow = false
				// this.getInit()

			}
		},
		navClick(index,item){
			console.log(uni.getStorageSync('token'))
			if(!uni.getStorageSync('token')){
				// this.loginshow = true
				// #ifdef MP
				this.getLogin()
				// #endif
				// // #ifdef H5
				// uni.setStorageSync('token',this.userinfo.token)
				// // uni.setStorageSync('userid',this.userinfo.user_id)
				// // #endif
			}else{
				this.moindex = index
				this.childrenlist = item.children
				this.moshow = true
				// this.moshow = true
				// this.navrouter("/pages_subject/twoPage/MyXieYiDetail?id="+item.id);
			}
			
		},
		chakao(item){
			console.log("+++"+uni.getStorageSync('token'))
			if(!uni.getStorageSync('token')){
				// this.loginshow = true
				// #ifdef MP
				this.getLogin()
				// #endif
				// // #ifdef H5
				// uni.setStorageSync('token',this.userinfo.token)
				// // uni.setStorageSync('userid',this.userinfo.user_id)
				// // #endif
			}else{
				this.navrouter("/pages_subject/twoPage/KaoDian");
			}
			// this.moshow = false
			
		},
		wenClick(item,index){
			let list = this.list
			list[index].iszhan = !list[index].iszhan
			this.list = list
		},
		chageng(e){
			if(e == 1){
				//查看更多
				this.list = []
				this.page = 1
				this.limit = 10
				this.status= "loadmore"
				this.getList()
			}else if(e == 2){
				//换一换
				let page = this.page;
				// let last_page = this.last_page;
				if (this.status == 'loadmore') {
					this.page++;
					this.getList();
				}else{
					this.$u.toast("没有更多数据啦～");
				}
			}
		},
		clickswiper(e){
			// console.log(e)
			// const articleUrl = 'https://mp.weixin.qq.com/s/G8aoxuNZzDRsrwEzmyFO6Q?__biz=wx87a0a84fab3a38c4';
			// uni.navigateToMiniProgram({
			// 	appId: 'wx87a0a84fab3a38c4', // 这里将"XXXXXXXXX"替换为真正的微信开放平台的AppID
			// 	path: '/pages/index/index', // 指定要打开的页面路径（根据自己项目结构而定）
			// 	extraData: {
			// 		url: articleUrl // 将文章链接作为extraData传递给目标页面
			// 	},
			// 	success(res) {
			// 		console.log('跳转成功'+res);
			// 	},
			// 	fail(err) {
			// 		console.log(err)
			// 	}
			// })		
			this.navrouter(`/pages/tabbar/url?url=${encodeURIComponent(this.banner[e].url)}`)
			// this.navigateToPublicAccountArticle()
		},
		navigateToPublicAccountArticle() {
			// const articleUrl = 'https://mp.weixin.qq.com/s/G8aoxuNZzDRsrwEzmyFO6Q?__biz=wx87a0a84fab3a38c4';
			// const articleUrl = 'https://mp.weixin.qq.com/s/G8aoxuNZzDRsrwEzmyFO6Q';
			this.navrouter(`/pages/tabbar/url?url=${encodeURIComponent(articleUrl)}`)
			// uni.navigateTo({
			// 	url: `/pages/publicaccount/index?url=${encodeURIComponent(articleUrl)}`, // 将文章链接作为query参数传递
			// 	success() {
			// 	console.log('成功跳转到公众号文章');
			// 	},
			// 	fail() {
			// 	console.error('跳转失败');
			// 	}
			// });
		},
		swchange(e){
			// console.log(e)
		}


	}
}
</script>

<style lang="scss" scoped>
page,
html {
	background-color: #ffffff;
}

/deep/ .u-sticky {
	z-index: 1007500000 !important;
}

.gllogo {
	width: 237rpx;
	height: 67rpx;
}

.hleft {
	position: absolute;
	left: 10px;
}

.newcontent {
	padding: 0rpx 30rpx 120rpx;
	display: flex;
	flex-direction: column;
	border-top: 1rpx solid #DDDDDD;
	.wrap{
		padding: 30rpx 0rpx 50rpx;
		display: flex;
		flex-direction: column;
		.leiview{
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			padding: 25rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(216,216,216,0.35);
			border-radius: 0rpx 0rpx 16rpx 16rpx;
			.quanviewitems{
				width: 48%;
				height: 110rpx;
				border-radius: 20rpx;
				position: relative;
			}
			.quanview{
				width: 100%;
				height: 100%;
				position: absolute;
				border-radius: 20rpx;
			}
		}
	}
	.yantit{
		display: flex;
		flex-direction: row;
		position: relative;
		align-items: center;
		margin-bottom: 20rpx;
		.hquan{
			width: 64rpx;
			height: 64rpx;
			position: absolute;
			left: 0;
		}
		.ytit{
			position: relative;
			font-size: 40rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #333333;
			display: inline-block;
			margin-left: 34rpx;
		}
	}
	.neione{
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(216,216,216,0.35);
		border-radius: 16rpx;
		padding: 32rpx 35rpx;
		margin-bottom: 50rpx;
		.neitit{
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #364656;
			line-height: 30rpx;
		}
		.biaozhi{
			display: flex;
			flex-direction: row;
			margin-top: 30rpx;
			justify-content: space-between;
			.biaoitem{
				// flex: 1;
				display: flex;
				flex-direction: column;
				align-items: center;
				// justify-content: space-between;
				text{
					display: inline-block;
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #9EA6B5;
					margin-top: 16rpx;
				}
				image{
					width: 88rpx;
					height: 88rpx;
				}
			}
		}

	}
	.neitwo{
		.swiper {
			// width: 50%;
			flex: 1;
			// margin: 0 20rpx;
			height: 400rpx;
			.swiperitem {
				display: flex;
				align-items: center;
				justify-content: center;
				flex-direction: column;
				width: 80% !important;
				margin-right: 25rpx;
				height: 365rpx !important;
				// background: #000;
				// box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(216,216,216,0.35);
				// border-radius: 16rpx;
				.sview{
					width: 94%;
					height: 95%;
					display: flex;
					flex-direction: column;
					box-shadow: 0px 0px 12px 0px rgba(216, 216, 216, 0.35);
					border-radius: 8px;
					background-color: #fff;
					padding: 30rpx;
					.lunone{
						display: flex;
						flex-direction: row;
						align-items: center;
						width: 100%;
						.jtou{
							width: 66rpx;
							height: 66rpx;
							margin-right: 8rpx;
							border-radius: 50%;
						}
						.jiright{
							display: flex;
							flex-direction: column;
							.jiname{
								max-width: 80%;
								display: inline-block;
								font-size: 26rpx;
								font-family: PingFang SC;
								font-weight: 500;
								color: #9EA6B5;
							}

						}

					}
					.lunwen{
						margin-top: 15rpx;
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #364656;
						overflow:hidden;
						text-overflow: ellipsis;
						-webkit-line-clamp: 5;
						display: -webkit-box;
						height: 98px;
						-webkit-box-orient: vertical;
					}

				}
			}

			.cetit {
				font-size: 20px;
				font-weight: 500;
				display: block;
				margin-bottom: 20rpx;
				color: rgba(255, 255, 255, 1);
				font-family: "Tangerine" !important;
			}
		}

		.xians {
			position: absolute;
			width: 100%;
			height: 100%;
		}

		.swiper-item {
			position: relative;

			.jiaobg {
				position: absolute;
				width: 100%;
				height: 100%;
			}
		}

		.twoimg {
			transform: rotate(180deg);
		}
	}
	.neithree{
		display: flex;
		flex-direction: column;
		.buview{
			margin-bottom: 20rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(216,216,216,0.35);
			border-radius: 16rpx;
			padding: 35rpx;
			.numview{
				position: relative;
				.oneicon{
					width: 49rpx;
					height: 41rpx;
					position: absolute;
					left: 0;
				}
				.stit{
					position: relative;
					padding-top: 25rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #364656;
					display: block;
					padding-left: 0rpx;
				}
			}
			.buimgview{
				margin-top: 30rpx;
				.buimg{
					width: 100%;
					height: 240rpx;
					border-radius: 5rpx;
				}
			}
		}
	}
	.neifour{
		padding: 32rpx 34rpx 0 34rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(216,216,216,0.35);
		border-radius: 16rpx;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		.neifview{
			width: 48%;
			display: flex;
			flex-direction: column;
			margin-bottom: 30rpx;
			.fimg{
				height: 190rpx;
				width: 100%;
				margin-bottom: 25rpx;
			}
			
			.butit{
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #364656;
			}
			.xian{
				display: inline-block;
				margin-bottom: 19rpx;
				width: 40rpx;
				height: 6rpx;
				background: linear-gradient(-90deg, #FF8745, #FFB00B);
				border-radius: 3rpx;
				margin-top: 12rpx;
			}
			.goumiao{
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #364656;
			}
		}
		.neifview:nth-child(even){
			margin-left: auto;
		}

	}
	.neifive{
		.wenview{
			padding: 32rpx 35rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(216,216,216,0.35);
			border-radius: 16rpx;
			margin-bottom: 20rpx;
			.wenone{
				display: flex;
				flex-direction: row;
				align-items: center;
				margin-bottom: 20rpx;
				.wenicon{
					width: 32rpx;
					margin-right: 15rpx;
					height: 32rpx;
				}
				.wentit{
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #364656;
				}
				.datit{
					width: 90%;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #364656;
				}
			}
			.wenone:last-child{
				margin-bottom: 0;
			}
		}
	}
	

	.hlist {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		
		.hitem {
			width: 48%;
			min-height: 400rpx;
			display: flex;
			flex-direction: column;
			border-radius: 20rpx 20rpx;
			margin-bottom: 30rpx;
			box-shadow: 0rpx 4rpx 6rpx 1rpx rgba(107, 107, 107, 0.07);

			.hone {
				width: 100%;
				height: 330rpx;
				border-radius: 20rpx 20rpx 0 0;

				.listimg {
					width: 100%;
					height: 100%;
					border-radius: 20rpx 20rpx 0 0;
				}

			}

			.htwo {
				padding: 15rpx 15rpx 25rpx;

				.hname {
					font-size: 26rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #333333;
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden; //溢出内容隐藏
					text-overflow: ellipsis; //文本溢出部分用省略号表示
					display: -webkit-box; //特别显示模式
					-webkit-line-clamp: 2; //行数
					line-clamp: 2;
					-webkit-box-orient: vertical; //盒子中内容竖直排列

				}

				.hmiao {
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #666666;
					display: block;
					margin-top: 8rpx;
				}
			}
		}

		.hitem:nth-child(even) {
			margin-left: auto;
		}
	}
}


.txt {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.nodata{
	margin: 30rpx 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}
uni-image { pointer-events: auto !important; }

.htit{
	// height: 60rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-family: PingFang SC, PingFang SC;
	font-weight: 600;
	color: #121212;
	position: absolute;
	z-index: 10;
	width: 100%;
	padding-top:  calc(var(--status-bar-height) + env(safe-area-inset-top); 
}

.immerse {
	width: 100%;
	height: calc(var(--status-bar-height) + env(safe-area-inset-top));
	background-color: #fff;
	// #ifdef APP-PLUS
	height: calc(var(--status-bar-height);
			// #endif
			z-index: 1007500000;
			position: relative;
	}</style>
